import React from 'react';

import styles from './toast.css';
import getThemeColor from "../../utils/themeutil";

class SimpleToast extends React.Component {
  componentDidMount() {
    this.timer = setTimeout(
      () => {
        this.props.cancel();
      },
      2500
    );
  }

  componentWillUnmount() {
    // 如果存在this.timer，则使用clearTimeout清空。
    // 如果你使用多个timer，那么用多个变量，或者用个数组来保存引用，然后逐个clear
    this.timer && clearTimeout(this.timer);
    this.props.cancel();
  }

  render() {
    const {info} = this.props;

    return (
      <div className={styles.toast}
           style={{
             backgroundColor: getThemeColor()
           }}>
        {info}
      </div>
    )
  }
}

export default SimpleToast;
